<!DOCTYPE html>

<html style="padding-bottom: 54px;">
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">

<meta name="viewport" content="width=device-width, initial-scale=1">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="renderer" content="webkit">
<title>学习工坊--响应式项目提取工具</title>

<link href="css3/demo.css" rel="stylesheet" media="all">
<link href="css3/index.css" rel="stylesheet" >
<!--[if IE]>
			
			<style type="text/css">			
				li.purchase a {
					padding-top: 5px;
					background-position: 0px -4px;
				}
				
				li.remove_frame a {
					padding-top: 5px;
					background-position: 0px -3px;
				}						
			</style>
			
		<![endif]-->
<style>     
  #sub1{border-radius:8%;margin-left:4px;}
</style>

<script src="css3/hm.js">
    
</script>
<script type="text/javascript">
       /* var txt = "http://chenglingr.gitee.io/kuaidi/";
        window.g1 = txt.substr(0, 3);
        window.g2 = txt.substr(0, 19);*/
</script>
<script src="css3/pace.min.js" charset="gbk"></script>
<link href="css3/pace-theme-barber-shop.css" rel="stylesheet">
<script src="css3/jquery.min.js"></script>
<script src="css3/jquery.qrcode.min.js"></script>
<script type="text/javascript">

        var theme_list_open = false;

        $(document).ready(function () {
            function fixHeight() {
                var headerHeight = $("#switcher").height();
                $("#iframe").attr("height", $(window).height() - 54 + "px");
            }
            $(window).resize(function () {
                fixHeight();
            }).resize();

            $('.icon-monitor').addClass('active');

            $(".icon-mobile-3").click(function () {
                $("#by").css("overflow-y", "auto");
                $('#iframe-wrap').removeClass().addClass('mobile-width-3');
                $('.icon-tablet,.icon-mobile-1,.icon-monitor,.icon-mobile-2,.icon-mobile-3').removeClass('active');
                $(this).addClass('active');
                return false;
            });

            $(".icon-mobile-2").click(function () {
                $("#by").css("overflow-y", "auto");
                $('#iframe-wrap').removeClass().addClass('mobile-width-2');
                $('.icon-tablet,.icon-mobile-1,.icon-monitor,.icon-mobile-2,.icon-mobile-3').removeClass('active');
                $(this).addClass('active');
                return false;
            });

            $(".icon-mobile-1").click(function () {
                $("#by").css("overflow-y", "auto");
                $('#iframe-wrap').removeClass().addClass('mobile-width');
                $('.icon-tablet,.icon-mobile,.icon-monitor,.icon-mobile-2,.icon-mobile-3').removeClass('active');
                $(this).addClass('active');
                return false;
            });

            $(".icon-tablet").click(function () {
                $("#by").css("overflow-y", "auto");
                $('#iframe-wrap').removeClass().addClass('tablet-width');
                $('.icon-tablet,.icon-mobile-1,.icon-monitor,.icon-mobile-2,.icon-mobile-3').removeClass('active');
                $(this).addClass('active');
                return false;
            });

            $(".icon-monitor").click(function () {
                $("#by").css("overflow-y", "hidden");
                $('#iframe-wrap').removeClass().addClass('full-width');
                $('.icon-tablet,.icon-mobile-1,.icon-monitor,.icon-mobile-2,.icon-mobile-3').removeClass('active');
                $(this).addClass('active');
                return false;
            });
        });
    </script>
<script type="text/javascript">
        function Responsive($a) {
            if ($a == true) $("#Device").css("opacity", "100");
            if ($a == false) $("#Device").css("opacity", "0");
            $('#iframe-wrap').removeClass().addClass('full-width');
            $('.icon-tablet,.icon-mobile-1,.icon-monitor,.icon-mobile-2,.icon-mobile-3').removeClass('active');
            $(this).addClass('active');
            return false;
        };
    </script>
</head>
<body id="by" style="overflow-y: auto;" class="  pace-done">

<div id="switcher">
<div class="center">
<ul>
    <li class="logoTop lgo" id="sj2">
          <a href="index.html">
            <img src="css3/logo.png" >
          </a>
    </li>
<div id="Device">
<li class="device-monitor"><a href="javascript:">
<div class="icon-monitor active">
</div>
</a></li>
<li class="device-mobile"><a href="javascript:">
<div class="icon-tablet">
</div>
</a></li>
<li class="device-mobile " id="none1"><a href="javascript:">
<div class="icon-mobile-1">
</div>
</a></li>
<li class="device-mobile-2"><a href="javascript:">
<div class="icon-mobile-2">
</div>
</a></li>
<li class="device-mobile-3 " id="none2"><a href="javascript:">
<div class="icon-mobile-3">
</div>
</a></li>
</div>
<li class="top2" id="sj"><a href="">手机二维码预览</a><div class="vm">
<div id="output"></div>
<p style="color: #808080">扫一扫，直接在手机上打开</p>
</div>
</li>
<li>
    <div class="input-group">
          <input type="text" class="url form-control" id="url" value="" placeholder="请输入项目名">
          <span class="input-group-btn">
            <button class="btn btn-default" id="sub" type="button">项目提取</button>
          </span>
          <span class="input-group-btn b2">
            <button class="btn btn-default" id="sub1" type="button">重新加载</button>
          </span>
        </div>

</li>

<script>

</script>
<li class="remove_frame" style="display:n"><a href="" id="del" title="移除框架"></a></li>
</ul>
</div>
</div>
<div id="iframe-wrap" >
<iframe id="iframe" src="" frameborder="0" width="100%" height="512px"></iframe>
</div>

<script type="text/javascript">         

        $('#sub').click(function(){
            var url=$('#url').val()+".html";
            $("#iframe").attr("src",url);    
            $('#del').attr('href',url);
            $('#output').html('');
            jQuery('#output').qrcode({ width: 150, height: 150, text:'http://chenglingr0.gitee.io/tools/'+url});//window.location.href
        })
        $('#sub1').click(function(){
            var url=$('#url').val()+".html";
            $("#iframe").attr("src",url);    
            $('#del').attr('href',url)
            $('#output').html('');
            jQuery('#output').qrcode({ width: 150, height: 150, text:'http://chenglingr0.gitee.io/tools/'+url});
        })
</script>

</body>

</html>